<template>

    <div class="container">
        <div class="addressInfo">
            <span>广州天河区环城街道-省市</span>
            <div class="add">
                <i>体育西路6号601 菜鸟驿站收</i>
                <van-icon name="arrow" />
            </div>
            <div class="phone">
                <em>孙尚香</em> <em>150****8212</em>
            </div>
        </div>

        <van-card v-for="(item, index) in cartGoodsList" :key="index" :num="item.cartAmount"
            :price="Number(item.price).toFixed(2)" :title="item.name" :thumb="item.img" />

        <van-cell title="运费" value="￥10" size="large" />
        <van-cell title="优惠券" value="无可用>" size="large" />
        <van-cell title="发票" value="电子普通发票-个人>" size="large" />

        <van-submit-bar :price="totalPrice" button-text="去付款" @submit="onSubmit">
        </van-submit-bar>
    </div>
</template>

<script>
import { Dialog } from 'vant';

export default {
    name: "",
    data() {
        return {
            cartGoodsList: [],
            show: false,
            areaList: ['sc','xa']
        }
    },
    computed: {
        totalPrice() {
            return (this.cartGoodsList[0].price * this.cartGoodsList[0].cartAmount) * 100
        }
    },
    methods: {
        onSubmit() {
            Dialog.alert({
                title: '哈哈',
                message: '付款功能尚未开发完成，敬请期待哦~~~。',
            }).then(() => {
                // on close
            });
        }
    },
    created() {
        this.cartGoodsList.push(this.$route.query)
    }


}
</script>

<style lang="less" scoped>
* {
    font-style: normal;
}

.container {
    position: absolute;
    margin-top: 50px;

    .addressInfo {
        padding: 10px;
        width: 100%;
        height: 100px;
        display: flex;
        flex-direction: column;
        justify-content: space-around;

        .add {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        i {
            font-weight: 800;
            font-size: 22px;
        }
    }
}
</style>